<template>
  <!-- vip定价 -->
  <div class="app-container">
    <div class="boxlaw">
      <h1>问金消耗设定</h1>
      <el-button
        @click="newAddFn"
        type="primary"
        v-hasPermi="['base:config:addVoucher']"
        >新增</el-button
      >
      <ComTable
        @handleCurrentChange="CurrentPageChangeFn"
        @handleSizeChange="currentPageSizeChangeFn"
        :key="random"
        :list="tableList"
        :modes="tableModes"
        :config="{ border: true, loading }"
        :pagination="{ total: paging.total, pageNum: paging.pageNum }"
      >
        <el-table-column #default="{ row }" align="left">
          <template>
            <el-button
              @click="editFn(row)"
              v-hasPermi="['base:config:getInfoVoucher']"
              plain
              size="mini"
              type="primary"
              >修改</el-button
            >
          </template>
        </el-table-column>
      </ComTable>
      <ComDialog
        @EventClose="closeFn"
        :dialogVisible="EditdialogVisible"
        title="修改问金消耗"
      >
        <el-form
          :rules="EditFormRules"
          label-width="50px"
          ref="Form"
          :model="FormData"
        >
          <template>
            <el-form-item label="金额" prop="value">
              <el-input v-model.number="FormData.value"></el-input>
            </el-form-item>
          </template>
        </el-form>
        <template #footer>
          <el-button @click="EditdialogVisible = false">取消</el-button>
          <el-button
            type="primary"
            @click="saveFn"
            v-hasPermi="['base:config:editVoucher']"
            >保存</el-button
          >
        </template>
      </ComDialog>
      <ConsumeAdd
        @EventgetList="getPriceVipGetInfoFn"
        :dialogVisible.sync="AdddialogVisible"
      ></ConsumeAdd>
    </div>
  </div>
</template>

<script>
import ComForm from "../../../../components/comForm.vue";
import ComSelect from "../../../../components/comSelect.vue";
import ComTable from "../../../../components/comTable.vue";
import comForm from "../../../../components/comForm.vue";

import AddAndEdit from "./addAndEdit.vue";
import ComDialog from "../../../../components/comDialog.vue";
import {
  getConfigGetInfoVoucherApi,
  getConfigEditVoucherApi,
  getconfigListVoucherApi,
} from "@/wss/api/financial/pricing/listVoucher.js";
import ConsumeAdd from "./consumeAdd.vue";
export default {
  dicts: ["sys_normal_disable"],
  components: {
    ComSelect,
    ComForm,
    comForm,
    ComTable,
    AddAndEdit,
    ComDialog,
    ConsumeAdd,
  },

  data() {
    return {
      // 是否显示修改对话框
      AdddialogVisible: false,
      // 是否显示修改对话框
      EditdialogVisible: false,
      initSelectValue: "",
      // 加载
      loading: false,
      paging: { pageNum: 1, pageSize: 10, status: "", total: 10 },
      // 切换筛选状态，不更新bug修复
      random: "",
      // 当前筛选的状态
      currentSelect: "",
      //   编辑发给后端对象
      FormData: {
        value: "",
        type: "",
      },
      EditFormRules: {
        value: [
          {
            type: "number",
            message: "无效",
            trigger: "blur",
          },
        ],
      },
      // 表格的数据
      tableList: [],
      tableModes: [
        {
          label: "消费类型",
          mode: "name",
        },
        {
          showOverflowTooltip: true,
          width: 200,
          label: "消耗问金 / 次",
          mode: "value",
          showOverflowTooltip: true,
        },
      ],
    };
  },

  mounted() {
    this.getPriceVipGetInfoFn(this.paging);
  },
  methods: {
    // 新增
    newAddFn() {
      this.AdddialogVisible = true;
    },
    // 重设函数
    resetFn() {
      this.initSelectValue = "";
      this.romdom = Math.random();
      this.options.value = "";
      this.paging.status = "";
      console.log(this.paging, "重设");
    },
    // 当前页发生改变时候
    CurrentPageChangeFn(pageNUm) {
      this.paging.pageNum = pageNUm;
      this.getPriceVipGetInfoFn(this.paging);
    },
    // 页容量发生改变时候
    currentPageSizeChangeFn(pageSize) {
      this.paging.pageSize = pageSize;
      this.getPriceVipGetInfoFn(this.paging);
    },
    // 筛选数据
    queryFn(arr) {
      arr.forEach((item) => {
        for (const key in item) {
          this.paging[key] = item[key];
        }
      });
      this.currentSelect = this.initSelectValue;
      console.log(this.paging, "查询");
      this.paging.pageNum = 1;
      this.getPriceVipGetInfoFn(this.paging);
    },
    // 获取列表数据
    async getPriceVipGetInfoFn(pagination = null) {
      this.loading = true;
      let { rows, code } = await getconfigListVoucherApi(pagination);

      if (code == 200) {
        this.tableList = rows;
        this.tableList.map((item) => {
          item.save = item.amount - item.price;
        });
      }
      this.loading = false;
      console.log(rows, "问金消耗设定");
    },
    // 关闭对话框
    closeFn() {
      this.EditdialogVisible = false;
    },
    // 保存对话框
    async saveFn(row) {
      // 修改

      await this.$refs.Form.validate();
      const { code, msg } = await getConfigEditVoucherApi([this.FormData]);
      if (code == 200) {
        try {
          this.$modal.msgSuccess(msg);
          this.EditdialogVisible = false;
          this.getPriceVipGetInfoFn();
        } catch (error) {
          this.$modal.msgError(error);
        }
      }
      // 保存
    },
    // 打开编辑器对话框
    async editFn(row) {
      this.EditdialogVisible = true;
      let { code, data } = await getConfigGetInfoVoucherApi({ id: row.idStr });
      // console.log(result);
      if (code == 200) {
        this.FormData.value = data.value;
        this.FormData.id = data.idStr;
      }

      //根据id获取详细信息
      //   await this.$refs.AddAndEdit.getPriceVipGetInfoFn(row);
      // console.log(result);
    },
  },
};
</script>

<style lang ="scss" scoped>
.comform {
  margin-top: 20px;
}
</style>